﻿<!DOCTYPE html>
<html>
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <!--The viewport meta tag is used to improve the presentation and behavior of the samples 
      on iOS devices-->
    <meta name="viewport" content="initial-scale=1, maximum-scale=1,user-scalable=no">
    <title>ArcGISDynamicMapServiceLayer</title>

    <link rel="stylesheet" type="text/css" href="http://localhost:8080/testA/arcgisjs/js/dojo/dijit/themes/tundra/tundra.css" />
    <script type="text/javascript" src="http://localhost:8080/testA/arcgisjs/init.js"></script>
    <script type="text/javascript" src="http://localhost:8080/testA/arcgisjs/jsapi_vsdoc12_v38.js"></script>
    <link rel="stylesheet" type="text/css" href="http://localhost:8080/testA/arcgisjs/js/esri/css/esri.css" />

    <script>
        var map;

        require([
          "esri/map",
          "esri/layers/ArcGISDynamicMapServiceLayer",
          "esri/layers/ImageParameters",
          "dojo/dom",
          "dojo/on",
          "dojo/query",
          "dojo/domReady!"
        ],
          function (Map, ArcGISDynamicMapServiceLayer, ImageParameters, dom, on, query) {
              var layer, visibleLayerIds = [];

              map = new Map("map");

           
              var imageParameters = new ImageParameters();
              imageParameters.layerIds = [2];
              imageParameters.layerOption = ImageParameters.LAYER_OPTION_SHOW; //只显示指定的层ID
              

              layer = new ArcGISDynamicMapServiceLayer("http://sampleserver1.arcgisonline.com/ArcGIS/rest/services/Specialty/ESRI_StatesCitiesRivers_USA/MapServer",
                { "imageParameters": imageParameters });
              map.addLayer(layer);

              on(dom.byId("layer0CheckBox"), "change", updateLayerVisibility);
              on(dom.byId("layer1CheckBox"), "change", updateLayerVisibility);

              function updateLayerVisibility() {
                  var inputs = query(".list_item");//筛选复合条件的控件
                  var inputCount = inputs.length;
                  visibleLayerIds = [2];

                  for (var i = 0; i < inputCount; i++) {
                      if (inputs[i].checked) {
                          visibleLayerIds.push(inputs[i].value);//指定显示图层的索引
                      }
                  }

                  if (visibleLayerIds.length === 0) {
                      visibleLayerIds.push(-1);
                  }

                  layer.setVisibleLayers(visibleLayerIds);
              }
          });
    </script>
  </head>

  <body>
  This sample loads an ArcGISDynamicMapServiceLayer and presents check boxes for only the layers that should be toggled on and off by users.  <br />
    <br />
        Layer List : <span id="layer_list"><input type='checkbox' class='list_item' id='layer0CheckBox' value=0 />Cities  
          <input type='checkbox' class='list_item' id='layer1CheckBox' value=1 />Rivers  
        </span><br />
        <br />
    <div id="map" class="claro" style="width:600px; height:400px; border:1px solid #000;"></div>
  </body>

</html>